<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="renderer" content="webkit"/>
  <meta name="force-rendering" content="webkit"/>
  <!-- import CSS -->
  <link rel="stylesheet" href="../js/3rd/elementUi/index.css">
  <link rel="stylesheet" href="../css/pc.css">
  <script src="../js/3rd/elementUi/vue.js"></script>
  <script src="../js/3rd/jquery-3.1.1.min.js"></script>
</head>
<body>
  <div id="userLists" class="user-lists" style="display:none">
    
	<el-container>
	  <el-aside class="sider-bar" id="siderbar">
      <div class="logo"><img src="../image/logo.jpg">来赚吧管理后台</div> 
	    <tp-siderbar title="发布项目"></tp-siderbar>
	  </el-aside>
    <el-main>
	  <div class="right-content">
      <el-breadcrumb separator-class="el-icon-arrow-right" class="bread-bd">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>项目列表</el-breadcrumb-item>
      </el-breadcrumb>
           
      <div class="user-teb">
        <el-tabs  v-model="activeName" @tab-click="handleClick">
          <el-tab-pane label="全部会员" name="first">全部会员</el-tab-pane>
          <el-tab-pane label="VIP会员" name="second">VIP会员</el-tab-pane>
          <el-tab-pane label="普通会员" name="third">普通会员</el-tab-pane>
		  <el-tab-pane label="pos机股东" name="four">pos机股东</el-tab-pane>
        </el-tabs>
        <div class="search-l">
          <el-input placeholder="请输入搜索手机号" size="medium" v-model="telephoneNum" class="input-with-select">
            <el-button slot="append" icon="el-icon-search" @click="searchByTelephone"></el-button>
          </el-input>
        </div>
      </div>
      <template>
        <el-table
          :data="userData"
          stripe
          style="width: 100%">
          <el-table-column
            prop="id"
            label="编号"
            width="180">
          </el-table-column>
          <el-table-column
            prop="telephone"
            label="手机号"
            width="180">
          </el-table-column>
		  <el-table-column
		    prop="userDirect.telephone"
		    label="推荐人手机号"
		    width="180">
		  </el-table-column>
		  <el-table-column
		    prop="realName"
		    label="姓名"
		    width="180">
		  </el-table-column>
		  <el-table-column 
		    prop="stockNumber"
		    label="股份"
		    width="180">
		  </el-table-column>
          <el-table-column
            prop="createTime"
            label="注册时间">
          </el-table-column>
          <el-table-column
            prop="scoreTotal"
            label="用户积分">      
          </el-table-column>
          <el-table-column
            prop="downlineNumber"
            label="下线数量">
          </el-table-column>
          <el-table-column label="操作" v-if="currentTab==3">
            <template slot-scope="scope">
              <el-button
                size="mini"
                @click="removeCrowdFunding(scope.$index, scope.row)">移除股东</el-button>              
            </template>           
          </el-table-column>
        </el-table>
      </template>

       
      <el-pagination
        :page-size="20"

        layout="prev, pager, next"
        @current-change="handleCurrentChange"
        :total="totalCount">
      </el-pagination>
      <div class="clearfix"></div>
    </div>  
   </el-main>  
	</el-container>

  </div>
</body>


  <!-- import JavaScript -->
  <script src="../js/3rd/elementUi/index.js"></script>
  <script src="../js/js/admin_siderbar.js"></script>
  <script src="../js/js/common.js"></script>
  <script>
   var token=getCookie("userToken");
   var userId=getCookie("userId");
   if(!token||!userId){
      window.location.href = "/admin/login.html";
   }
    new Vue({
      el: '#userLists',
      data: {
        userData:[],
        telephoneNum:'',
        currentTab:null,
        totalCount:null,
        activeName: 'first',
        page:1,
      },
      created:function(){
         var getUsersUrl="/user/getUsers";
         var data={
                   category:null,
                   page: 1,
                   size: 20,
                   telephone: "",
                   token: token,
                   userId: parseInt(userId),
                   client: 3,
         }
         pushData(getUsersUrl,data,function(res){
             console.log(res)
             this.userData=res.data.user;
             this.totalCount=res.data.totalCount;     
             this.filterUserData();
         }.bind(this));
         $("#userLists").show();
      },     
      methods:{
            removeCrowdFunding:function(index,row){
              var that=this;
              this.$confirm('确定要删除该用户的股东身份?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
              }).then(() => {
                  var url="/user/removeStock"
                  var data={
                       token: token,
                       userId: parseInt(userId),
                       client: 3,
                       id:row.id
                  }
                  pushData(url,data,function(res){
                    if(res.errorCode=="008"){
                         window.location.href = "/admin/login.html";
                         return
                    }
                    if(res.state){
                      that.userData.splice(row,1)
                      that.$message({
                        type: 'success',
                        message: '删除成功!'
                      });
                    }
                  })
                
              }).catch(() => {
                this.$message({
                  type: 'info',
                  message: '已取消删除'
                });          
              });
               
            },
            handleCurrentChange:function(val){
               console.log(val);
               var getUsersUrl="/user/getUsers";
               this.page=val;
               var data={
                         category:this.currentTab,
                         page: val,
                         size: 20,
                         telephone: this.telephoneNum,
                         token: token,
                         userId: parseInt(userId),
                         client: 3,
               }
               //console.log(data)
               pushData(getUsersUrl,data,function(res){
                   console.log(res)
                   if(res.errorCode=="008"){
                     window.location.href = "/admin/login.html";
                   }
                   this.userData=res.data.user;
                   this.totalCount=res.data.totalCount;
                   this.filterUserData();
               }.bind(this))
            },
            handleClick(tab, event) {
             // console.log(tab);
               this.currentTab=this.getUserCategory(tab);
               var getUsersUrl="/user/getUsers";
               var data={
                         category:this.getUserCategory(tab),
                         page: 1,
                         size: 20,
                         telephone: "",
                         token: token,
                         userId: parseInt(userId),
                         client: 3,
               }
               console.log(data)
               pushData(getUsersUrl,data,function(res){
                   console.log(res)
                   this.userData=res.data.user;
                   this.totalCount=parseInt(res.data.totalCount);
                   console.log(this.totalCount)
                   this.filterUserData();
               }.bind(this))
            },
            searchByTelephone:function(){
               var getUsersUrl="/user/getUsers";
               var data={
                         category:this.currentTab,
                         page: this.page,
                         size: 20,
                         telephone: this.telephoneNum,
                         token: token,
                         userId: parseInt(userId),
                         client: 3,
               }
               console.log(data)
               pushData(getUsersUrl,data,function(res){
                   console.log(res)
                   this.userData=res.data.user;
                   this.totalCount=res.data.totalCount;
                   this.filterUserData();
               }.bind(this))
            },
            filterUserData:function(){
              for(var i=0;i<this.userData.length;i++){
                     this.userData[i].createTime=formatDate(this.userData[i].createTime)
                     if(!this.userData[i].score){
                        this.userData[i].score="0";
                     }
                     if(!this.userData[i].downlineNumber){
                        this.userData[i].downlineNumber="无"
                     }
                   }
            },
            getUserCategory:function(category){
              if(category.label=="全部会员"){
                return null;
              }else if(category.label=="VIP会员"){
                return 2;
              }else if(category.label=="普通会员"){
                return 1
              }else if(category.label=="pos机股东"){
                return 3
              }
            }

        }

      
    })
  </script>
</html>